<template>
  <div class="card-body" @click="toGoods">
    <div class="card-img">
      <img :src="goods.img" alt="">
    </div>
    <div class="card-text">
      <p style="font-weight:bold">{{ goods.title }}</p>
      <div style="color:gray;">{{ "原价：" + goods.price + "  促销价  ：" + goods.price }}</div>
    </div>
  </div>
</template>
<script>
export default {
  props:{
    goods:{
      type: Object,
      default () {
        return {
          img: "",
          price: 0,
          title: "",
          index: 0,
        }
      },
    }
  },
  methods: {
    toGoods () {
      this.$router.push({
        name: "GoodsDetail",
        query: {
          id: this.goods.index
        }
      })
    }
  },
}
</script>
<style scoped>
.card-body{
  cursor: pointer;
}
.card-img{
  width: 100%;
  height: 240px;
}
.card-img img{
  width: 100%;
  height: 100%;
  border-radius: 6px 6px 0 0;
}
.card-text p{
  height: 44px;
  margin: 4px 0;
  overflow: hidden;
}
.card-text div{
  height: 22px;
  overflow: hidden;
}
</style>